<style lang = "scss" scoped>
#cmain{
    .mainContent{
        min-height:425px;
        border-radius:10px;
        background:#fff;
        box-shadow:0px 0px 15px 0px rgba(207,207,207,1);
        padding-top:10px;
        padding:0px 30px;
        .title{
            height: 50px;
            line-height:50px;
            border-bottom:1px solid #ccc;
            font-size:16px;
        }
        .patientForm{
            width:380px;
            margin:0 auto;
            margin-top:30px;
            .el-form-item{
                margin-bottom:27px;
                &::after{
                    display:none;
                }
                .el-form-item__content::after{
                    display:none;
                }
            }
        }
    }
}
</style>
<template>
    <div id = "cmain">
        <div class="mainContent">
            <div class="title">预约建档</div>
            <el-form class="patientForm" :model="patientForm" ref="patientForm" :rules="formRuler" label-width="80px">
                <el-form-item label="患者姓名" prop="name">
                    <el-input placeholder="请输入患者姓名" style="width:80%;" v-model="patientForm.name"></el-input>
                </el-form-item>
                <el-form-item label="性别" prop="sex">
                    <el-select placeholder="选择患者性别" style="width:89%;" v-model="patientForm.sex">
                        <el-option label="男" value="男"></el-option>
                        <el-option label="女" value="女"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="手机号码">
                    <el-input placeholder="请输入手机号码" style="width:80%;" v-model="patientForm.tel"></el-input>
                </el-form-item>
                <el-form-item label="出生日期">
                    <el-date-picker style="width:80%;" placeholder="请输入出生年月" type="date" v-model="patientForm.birthDate" @change="patientForm.birthDate = $event" value-format="yyyy-MM-dd"></el-date-picker>
                </el-form-item>
                <el-form-item>
                    <el-button size="small"  @click="cancel">取消</el-button>
                    <el-button size="small" type="primary" @click="submit">提交</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>
<script>
import {
    familyTree
} from 'api/index.js';
import { setCookie, getCookie, delCookie } from '@/common/js/cookie.js';
export default {
    name:"newPatient",
    data(){
        return {
            patientForm:{
                name:"",
                tel:"",
                birthDate:"",
                sex:""
            },
            formRuler:{
                "name":[{ required: true, message: '姓名不能为空', trigger: 'blur' }],
                "sex":[{ required: true, message: '性别不能为空', trigger: 'change' }]
            }
        }
    },
    methods:{
        submit(){
            var obj={
                userId: getCookie("userid"),
                // userId: "11",
                patientid:"",
                familyTree:this.patientForm
            };
            this.$refs.patientForm.validate((valid) => {
                if (valid) {
                    familyTree.insertFamilyTree(obj).then((res) => {
                        if(res.returnCode == 0 || res.returnCode == 200 ){
                            this.$Message.success(res.msg);
                            this.$router.push("/familyMain");
                        }
                    })
                }
            })
        },
        cancel(){
            this.$router.push("/familyMain");
        }
    }
}
</script>
<style>

</style>

